/**

 * User: seeker910
 * Date: 13-11-8
 * Time: 上午1:35 
 * 
 * 数据复选控件
 * 
 */
 Rsd.define('Rsd.form.Picker', {
    extend: 'Rsd.form.Input',
    requires:[],
    xtype: 'picker',
    //height: 30,
    //width: 80,
    inputType:'text', 
    /*
     click:方法可被注入
    * */
    handler: function () {
        //console.log(this.getValue());
    },
    listeners:{
        'blur':{
            element:'ctrl',
            fn:function (sender,event) {
                var me = this; 
                 //blur 事件在 click事件先发生，所以延时处理关闭
                setTimeout(function(){
 
                    if(!me.selector.cancelHide )
                    { 
                        me.selector.hide(50,function () {
                            //注销 全局事件click 
                            Rsd.events.remove(Rsd,'click',me.selector.id);
                        });
                    }
                    me.selector.cancelHide = false;  

                },500);
                
                return true;
            }
        },
        'focus':{
            element:'ctrl',
            fn:function (sender,event) {
                
                if(this.readonly)
                {
                    return true;
                }
                //判断事件 来源
                if(event.sourceCapabilities == null) { 
                    return true; 
                }

                var me = this; 
                
                event.isCancel = true;
                me.selector.cancelHide = false;
                if (me.selector) {
                     //
                     var _style = {top:null,left:null};
                     var _left = ((me.label.width ? me.label.width : me.label.element.clientWidth) + 10);
                     _style.marginLeft =  _left + 'px';
                     _style.marginTop = (me.height - parseInt(me.dom.style.marginBottom)) + 'px';  
                     _style.tabIndex = me.tabIndex;
                     me.selector.setElStyle('dom',_style);
                    me.selector.show(null, 0, function () {
    
                        var _selector = me.selector;
                        //注册全局click 事件延时加入 队列 防止click 事件 关闭显示
                        setTimeout(function(){
                             
                            Rsd.events.add(document.body, 'click', _selector.id, function (e) {
                                 
                                if(e.target == me.ctrl.element || e.target == _selector)
                                {
                                    //根据事件注册规则，返回flase 不移除注册方法
                                    return false;
                                }
                            
                                _selector.hide(10,function () {
                                     Rsd.events.remove(Rsd,'click',_selector.id);
                                 });
     
                             }, true);

                        },100);
                        
                    });
                        
                }
                return true;
            }
        },
        'keyup':{
            element:'ctrl',
            fn:function (sender,event) {

                if (event.code == 'Enter')
                {
                    var me = this;
                    this.selector.hide(500,function () {
                        //注销 全局事件click
                        Rsd.events.remove(Rsd,'click',me.selector.id);
                    });

                }
                if (event.code == 'Escape')
                {
                    var me = this;
                    this.selector.hide(500),function () {
                        //注销 全局事件click
                        Rsd.events.remove(Rsd,'click',me.selector.id);
                    };

                }
                if (event.code == 'ArrowUp')
                {

                }
                if (event.code == 'ArrowDown')
                {

                }

            }
        }
    },
    /**
    * @description 选择框面版样式
    * */
    panelStyle:{ },
    /**
     * 全选信息
     */
    selectAll:{text:'全 选',value:0},
    /* 
     */
    textMember:'text',
    valueMember:'value',
    /**
    数据源
    */
    dataSource:null,
    /**
    * */
    constructor: function Picker(config) {
        config = config || {};
        this.apply(config); 
    }, 
    /**
     * 
     */
   onAfterInit:function onAfterInit() {

        this.callParent();
        this.ctrl.element.readonly = true;

        var me = this;
      
       if (Rsd.isEmpty(this.selector)) {

       
           this.selector = Rsd.create('Rsd.container.TipBox', {
               layout:'vbox', 
               parent:me.dom,
               style:Rsd.apply({
                   width: 350,
                   height: 320 
                },me.panelStyle),
               listeners: {
                   'click': {
                       element: 'dom',
                       fn: function (sender, event) {
                           //在选择器控件自己上发生的click事件，导致录入框blur事件发生，阻止选择器关闭
                           me.selector.cancelHide = true;
                           event.isCancel = true;
                           return false;
                       }
                   }
               },
               items:[
                   {
                       flex:1,
                       xtype:'container',
                       bodyTagName:'div', 
                       onchange:function (date) {

                           me.setValue(date);

                       }

                   },
                   {
                        height:55,
                        width:120,
                        margin:'10 0 10 10',
                        xtype:'button',
                        text:me.selectAll.text
                   }
               ],
               loadData:function loadData(data) {

                   Rsd.empty(me.selector.items[0].body);
                   var ol = document.createElement('ol');
                   var style = {display:'flex',flexFlow:'row',flexWrap:'wrap',listStyleType:'none',padding:'0px 0px 0px 10px',margin:'0px'};
                   Rsd.setElStyle(ol,style)

                   me.dataSource = data ||[];
                   var list = me.dataSource;
                 
                    for (var i in list) {
                        var li = document.createElement('li');
                        li.tag = list[i];
                        li.id = list[i][me.valueMember];

                        var span = document.createElement('span');
                        span.style.textAlign = 'center';
                        span.style.height = '35px';
                        span.style.lineHeight = '35px';
                        span.style.width = '65px';
                        span.style.display = 'block';
                        span.style.margin = '1px';
                        span.style.color= '#fff';
                        span.style.backgroundColor= '#0a121c87'; 
                         
                        span.onclick = function (evt) {
                            var tag = this.parentElement.tag;
                            tag['IsSelected'] = !tag['IsSelected'];
                            this.style.backgroundColor = tag['IsSelected']? "#0a32c5e6":'#0a121c87';
                            me.ctrl.element.value = me.getText();
                            //根据事件注册规则，返回flase 不移除注册方法
                            return false;
            
                        }
                         
                        span.appendChild(document.createTextNode(list[i][me.textMember]));
                        li.appendChild(span);
                        ol.appendChild(li);
                        
                    }
                    me.log(me.selector.items[0].body);
                    me.selector.items[0].body.element.appendChild(ol);
               }

           });

       }

       setTimeout(function () {
          me.loadData(me.dataSource);
       },10);
   },
    /**  
     *可通过 重写该方法，定制多选框
     *
     * */
    loadData:function loadData(data) {

        var me = this;
        me.dataSource = data ||[];
        var list = me.dataSource;
        me.selector.loadData(list);
          
    },
    /**
     * 
     * */
    getText:function getText() {

        var _list = Rsd.select(this.selector,'li'); 
         var _temp = [];
         for(var i in _list)
         {  
             if(_list[i].tag['IsSelected'])
             {
                _temp.push(_list[i].tag[this.textMember]);
             } 
         }
         if(_temp.length > 0 )
         {
             return _temp.join(',');
         }
         //全选
         if( this.value == this.selectAll.value )
         {
            return this.selectAll.text;  
         }
         if( Rsd.isArray(this.value) && Rsd.isArray(this.selectAll.value) && this.value.length == 0 &&  this.selectAll.value.length ==0 )
         {
            return this.selectAll.text;  
         }
         return ""
         
     },
    /*
    * 参数 value 格式：逗号分隔在字符串 或 item 的 value值数据组
    * */
    setValue:function setValue(value)
    {   
        if(value == undefined || value == null  )
        {
            this.ctrl.element.value="";
            this.__value = null;
            return;
        }
        
       var _value = value ;
        
        if(Rsd.isString(_value)) {

           _value = _value.split(',');

        }

        if(Rsd.isArray(_value))
        { 
            //设置li 被选中
            var list = Rsd.select(this.selector,'li');
            for(var i in list)
            {
                list[i].tag["IsSelected"] = _value.indexOf(list[i].id)>-1
            }
             
        }
        this.__value = _value;
        this.ctrl.element.value = this.getText();
        
    },
    /**
    *
    * */
    getValue:function getValue() {

        var _temp = [];
        var list = Rsd.select(this.selector,'li');
        for(var i in list)
        {
            if(list[i].tag && list[i].tag['IsSelected'])
            {
                _temp.push(list[i].tag[this.valueMember]);
            }
        }
        if(_temp.length > 0)
        {
            this.__value = _temp;
            //console.log(_temp);
        } 
        return this.__value ;
  
    },
    /**
     * 
     */
    checkValue:function checkValue() {

        return true;

    }

},function(type){

    this.defineProperty(type,'selector',function(){return this["selector_"+this.id];},function(selector){

        this["selector_" + this.id] = selector;

    },false);
});

